<!DOCTYPE html>
<!--suppress ALL -->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的订单</title>
    <link rel="stylesheet" href="/css/supplies/bootstrap.min.css">
    <link rel="stylesheet" href="/js/supplies/bootstrap-table/bootstrap-table.min.css"/>
    <link rel="stylesheet" href="/css/supplies/common.css"/>
    <style>
        body{
            padding:0px 20px 20px 20px;
        }
        .nav>li>a {
            position: relative;
            display: block;
        }

        .content_main{
            clear: both;
            width: 100%;
            height: 100%;
        }
        #myTab{
            margin-bottom: 10px;
            -moz-box-shadow:0px 0px 22px #ddd; -webkit-box-shadow:0px 0px 22px #ddd; box-shadow:0px 0px 22px #ddd;
        }
        #myTab li {
            width: 180px;
        }

        #myTab li a {
            width: 160px;
        }

        /* layer 弹出框样式*/
        .btn_save{
            margin-left: -21px;
            margin-right: -21px;
            margin-top: -3px;
            float: left;
            color: #fff;
            width: 140px;
            height: 30px;
            text-align: center;
            line-height: 30px;
            background: -webkit-linear-gradient(left,  #FE5004,#FF9B02);
            background: -moz-linear-gradient(left,  #FE5004,#FF9B02);
            background: -o-linear-gradient(left,  #FE5004,#FF9B02);
            background: linear-gradient(left,  #FE5004,#FF9B02);
            background: #FF9B02 \9;
        }

        #myTab li a{
            font-size: 14px;
        }
    </style>
</head>
<body>
<div>

</div>
    <ul id="myTab" class="nav nav-tabs">
        <li class="active" onclick="openFrame('list')" id="list">
            <a href="#" data-toggle="tab">
                <div>订单列表</div>
                <div class="en_title">order list</div>
                <div class="title-bottom-border"></div>
            </a>
        </li>
        <li id="details" onclick="invaliOperation()">
            <a href="javascript:void(0)"  >
                <div>订单详情</div>
                <div class="en_title">order details</div>
                <div class="title-bottom-border"></div>
            </a>
        </li>
        <li id="operation" onclick="invaliOperation()">
            <a href="javascript:void(0)">
                <div>订单操作</div>
                <div class="en_title">order procession</div>
                <div class="title-bottom-border"></div>
            </a>
        </li>
        <li onclick="openFrame('evaluation')">
            <a href="#" data-toggle="tab">
                <div>订单评价</div>
                <div class="en_title">order feedback</div>
                <div class="title-bottom-border"></div>
            </a>
        </li>
    </ul>

<div class="content_main" id="content-main">
</div>


</body>
<script src="/js/supplies/jquery.min.js"></script>
<script src="/js/supplies/bootstrap.min.js"></script>
<script src="/js/supplies/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/js/supplies/common.js"></script>
<script src="/js/supplies/layer/layer.js"></script>

<script>
    $(function () {
        openFrame("list");
    })
    /*
     * @description : 打开子窗口
     * @params:
     * @author : peng huaneng
     * @date : 2018/1/18 10:46
     */
    function openFrame(name) {
        var html="";
        $("#content-main").html("");
        html += '<iframe name="iframe0" frameborder="0" scrolling="auto"  width="100%" class="J_iframe" id='+ name +'  src="'+name+'Order.html"' +
            ' onload="this.height=this.contentWindow.document.documentElement.scrollHeight"></iframe>'

        $("#content-main").html(html);
         reinitIframe1() ;
        if(name.indexOf("list") >= 0){
            var title  = [];
            title[0] = {navTitle:"我的订单",e_navTitle:"my order",titleImg:1};
            title[1] = {navTitle:"订单列表",e_navTitle:"order list",titleImg:0};
            window.parent.editTitle(title);
        }else if(name.indexOf("details") >= 0){
            return ;
        }else if(name.indexOf("operation") >= 0){
            var title  = [];
            title[0] = {navTitle:"我的订单",e_navTitle:"my order",titleImg:1};
            title[1] = {navTitle:"订单操作",e_navTitle:"order procession",titleImg:0};
            window.parent.editTitle(title);
        }else if(name.indexOf("evaluation") >= 0){
            var title  = [];
            title[0] = {navTitle:"我的订单",e_navTitle:"my order",titleImg:1};
            title[1] = {navTitle:"订单评价",e_navTitle:"order feedback",titleImg:0};
            window.parent.editTitle(title);
        }
    }
    // iframe自适应
    function reinitIframe1(){
       
        $(window).on('resize', function() {
            var $content = $('#content-main');
            $content.height($(this).height() - 145);
            $content.find('iframe').each(function() {
                $(this).height($content.height());
            });
        }).resize();
    }
/*
 * @description : 选中，并导航栏显示
 * @params:
 * @author : peng huaneng
 * @date : 2018/2/6 11:00
 */

    function detailsHighlight(value) {
        var title  = [];
        title[0] = {navTitle:"我的订单",e_navTitle:"my order",titleImg:1};
        title[1] = {navTitle:"订单详情",e_navTitle:"order details",titleImg:0};
        window.parent.editTitle(title);
        $("#details").addClass("active");
        $("#list").removeClass("active");
    }
    function operationHighlight(value) {
        var title  = [];
        title[0] = {navTitle:"我的订单",e_navTitle:"my order",titleImg:1};
        title[1] = {navTitle:"订单操作",e_navTitle:"order operation",titleImg:0};
        window.parent.editTitle(title);
        $("#operation").addClass("active");
        $("#list").removeClass("active");
    }
    /*
     * @description : 无效操作提示
     * @params:
     * @author : peng huaneng
     * @date : 2018/2/6 11:01
     */
    function invaliOperation() {
        layer.confirm('无效操作，请从订单列表进入！<br> ' +
            'invalid operation, please enter from the order list!', {
            btn: [ '<span class="btn_save">确认(determine)</span>'],
            move:false
        });
    }
</script>
</html>